import React, { Component } from 'react';
import BijiMenu from './BijiMenu';
import AddMenu from './AddMenu';
import SearchMenu from './SearchMenu';
import TagMenu from './TagMenu';
import TrashMenu from './TrashMenu';
import CircleMenu from './CircleMenu';
import UserMenu from './UserMenu';
import NoteBookMenu from './NoteBookMenu';


export default class Menu extends Component{

    constructor(props){
        super(props);
        this.state = { menu: "Biji" };
    }

    componentDidMount(){
        // 订阅获取Nav组件中的menu信息
        this.pubsub_token = PubSub.subscribe('getMenu', function (topic, message) {  
            this.setState({  
                menu: message  
            });  
        }.bind(this));  
    }

    componentWillUnmount(){
        // 组件将要移除时取消订阅  
        PubSub.unsubscribe(this.pubsub_token);  
    }
    
    // 动态加载子组件
    getComponents = () =>{
        let current_menu = this.state.menu;
        switch(current_menu){
            case 'Biji':
                return <BijiMenu/>;
            case 'Book':
                return <NoteBookMenu/>;
            case 'Add':
                return <AddMenu/>;
            case 'Search':
                return <SearchMenu/>;
            case 'Tag':
                return <TagMenu/>;
            case 'Trash':
                return <TrashMenu/>;
            case 'Circle':
                return <CircleMenu/>;
            case 'User':
                return <UserMenu/>
        }
    }

    render(){
        return(
            <div className="menu">
                { this.getComponents() }
            </div>
        );
    }
}